<form #addUserForm="ngForm">
  <div class="form-group clearfix">
    <label class="col-md-2"><span class="require-red">*</span>用户名</label>
    <div class="col-md-6">
      <input type="text" class="form-control" name="name" #userName="ngModel" [(ngModel)]="addAccount.name" required>
      <p [hidden]="userName.pristine || userName.valid" class="alert alert-danger">用户名不能为空!</p>
    </div>
  </div>
  <div class="form-group clearfix">
    <label class="col-md-2"><span class="require-red">*</span>手机号码</label>
    <div class="col-md-6">
      <input type="text" class="form-control" name="mobile" #mobile="ngModel" [(ngModel)] ="addAccount.mobile" required appValidateMobile>
      <div [hidden]="mobile?.valid || mobile?.pristine" class="alert alert-danger">
        <p *ngIf="mobile?.errors?.required">必须输入</p>
        <p *ngIf="mobile?.errors?.validateMobile">格式不正确</p>
      </div>
    </div>
  </div>
  <div class="form-group clearfix">
    <label class="col-md-2"><span class="require-red">*</span>邮箱</label>
    <div class="col-md-6">
      <input type="text" class="form-control" name="email" #email="ngModel" [(ngModel)]="addAccount.email" required appValidateEmail>
      <div [hidden]="email?.valid || email?.pristine" class="alert alert-danger">
        <p *ngIf="email?.errors?.required">必须输入</p>
        <p *ngIf="email?.errors?.validateEmail">格式不正确</p>
      </div>
    </div>
  </div>
  <div class="form-group clearfix">
    <label class="col-md-2"><span class="require-red">*</span>密码</label>
    <div class="col-md-6">
      <input type="password" class="form-control" name="password" #password="ngModel" [(ngModel)]="addAccount.password" required>
      <p [hidden]="password.pristine || password.valid" class="alert alert-danger">密码不能为空!</p>
    </div>
  </div>
  <div class="form-group clearfix">
    <label class="col-md-2"><span class="require-red">*</span>确认密码</label>
    <div class="col-md-6">
      <input type="password" class="form-control" name="psdAgain" #psdAgain="ngModel" [(ngModel)]="addAccount.password_again" required>
      <p [hidden]="psdAgain.pristine || psdAgain.valid" class="alert alert-danger">密码不能为空!</p>
    </div>
  </div>
</form>
<div class="col-md-8 text-center">
  <button class="btn btn-success" [disabled]="!addUserForm.form.valid" (click)="addUser()">确定</button>
  <button class="btn btn-success" type="reset" (click)="addUserForm.form.reset()">重置</button>
</div>

<app-notification [type]="type" [message]="message" [isShow]="isShow" (promptIsShow)="isShow = $event"></app-notification>
